<?php
#                                                                                 
# author: Phil Spagnolo and Cody Sorgenfrey                                       
# (c)2013 South Hill Calvary Chapel                                               
# 
include_once("common.php");
$title = "SHCC Directory";
$meta_key='pictures, families, directory, names, last, first, address, phone, cell, email';
$meta_desc="The all church directory at South Hill Calvary Chapel.";
$morehtml= NULL;
$morejava= NULL;
startPageNoPageContent($title, $meta_key, $meta_desc, $morehtml, $morejava);
?>
<style type="text/css">
	#loginBox{
		width: 200px;
		height: 140px;
		text-align: center;
		padding-top: 30px;
		margin-right: auto;
		margin-left: auto;
		border-radius: 5px;
		box-shadow: 1px 1px 4px black;
	}
	#loginError{
		color: red;
	}
	#noPass{
		margin-top: 10px;
		font-size: 80%;
		text-align: center;
	}
	#numResults{
		display: inline-block;
	}
	.result{
		width: 97%;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 5px;
		border-radius: 5px;
		padding: 5px;
		box-shadow: 1px 1px 4px black;
	}
	td:first-child{
		width: 40%;
	}
	td:last-child{
		margin-left: 10px;
	}
	.Names {
		font-family: Gnuolane;
		font-size: 150%;
	}
	.Kids{
		font-style: italic;
	}
	.Picture{
		width: 95%;
		margin-left: 10px;
	}
	.hidden{
		display: none;
	}
@media (max-width: 769px) {
	#loginbox{
		padding-top: 1px;
		padding-bottom: 5px;
		height: auto;
		margin-top: 10px;
	}
	#results{
		margin-top: 40px;
		width: 95%;
		margin-right: auto;
		margin-left: auto;
	}
	.noPlaceholder{
		display: none;
	}
	td:last-child{
		padding: 0px 5px 0px 5px;
	}
	.Picture{
		margin-left: 5px;
	}
}
</style>
<script type="text/javascript">
	var info = "init";
	<?
		if ($_COOKIE['directoryLogin']){
			$csv = file_get_contents("https://docs.google.com/spreadsheet/pub?key=0AhA9ts4S-JmedHJpQ3FfYUVBT0VJMzZhWkZGZXdPZUE&single=true&gid=0&output=csv");
			$csv =  str_replace("\n", "|row|", $csv);
			$csv =  str_replace("\"", "|enclosure|", $csv);
			echo "info = \"".$csv."\";";
		}
	?>
	var titles;
	$(document).ready(function(){
		if (document.cookie.search("directoryLogin") >= 0){
			parseData();
			printTable();
			initPage();
		}
	});
	function parseData(){
		info = info.split("|row|");
    	for (x in info){
    		info[x] = new String(info[x]).replace(/\|enclosure\|(.+)?,(.+)?\|enclosure\|/g, function(){
	    		return arguments[0].replace(/,/g, "|multi|");
    		});
   			info[x] = info[x].split(",");
			for (y in info[x]){
				info[x][y] = info[x][y].replace(/\|multi\|/g, ", ");
				info[x][y] = info[x][y].replace(/\|enclosure\|/g, "");
			}
    	}
    	titles = info.shift();
	}
	function printTable(){
		$("#results").text("");
		for (x in info){
			var resultStr = "<div class='result'>";
			resultStr += "<table><tr><td>";
			var img = info[x].pop().replace(/:/g, "/").replace(/\.[A-Za-z]{3}$/, ".jpg").replace("C/Documents and SettingsJessicaDesktopimages", "http://www.southhillcalvary.org/images/Directory/");
			if (img){
				resultStr += "<img class='Picture' src='"+img+"' />";
			}
			resultStr += "</td><td>";
			for (y in info[x]){
				if (info[x][y].length != 0){
					resultStr += "<p class='"+titles[y]+"'>"+info[x][y]+"</p>";
				}
			}
			resultStr += "</td></tr></table></div>";
			$("#results").append(resultStr);
		}
	}
	function initPage(){
		updateResultCount();
		$(".First").each(function(){
			$(this).prev().append(", "+$(this).text()).addClass("Names").removeClass("Last");
			$(this).remove();
		});
		$(".Address").each(function(){
			$(this).append(", "+$(this).siblings(".City").text()+", "+$(this).siblings(".State").text()+" "+$(this).siblings(".Zip").text());
			$(this).siblings(".City, .State, .Zip").remove();
		});
		$("[class^='Email']").each(function(){
			$(this).html("<a href='mailto:"+$(this).text()+"'>"+$(this).text()+"</a>");
		});
		$("[class$='_Name']").each(function(){
			$(this).prev().append(" "+$(this).text());
			$(this).remove();
		});
	}
	function updateResultCount(){
		$("#numResults").text("showing "+$(".result:not(.hidden)").length+" results");
	}
	function searchTable(input){
		if (input == ""){
			$(".result").removeClass("hidden");
		} else {
			$(".result").addClass("hidden");
			var searchPhrase = new RegExp(input, "i");
			$(".result").each(function(index){
				if ($(this).text().search(searchPhrase) >= 0) {
					$(this).removeClass("hidden");
				}
			});
		}
		updateResultCount();
	}
	function searchTableFor(str){
		document.getElementById("searchBar").value = str;
		searchTable(document.getElementById("searchBar"));
		$(document).ready(function(){
			$(".dotted_lines").children().css("opacity", "1");
		});
	}
</script>
<?
if ($_POST['pass'] == "Fam1ly"){
	?>
	<script type="text/javascript">
		document.cookie = "directoryLogin=1";
		document.location = document.location;
	</script>
	<?
} else if (!empty($_POST['pass'])){
	?>
	<script type="text/javascript">
		document.location.search = "?loginError=Incorrect+Password";
	</script>
	<?
}
if (empty($_COOKIE['directoryLogin'])){
	?>
	<div id='loginBox'>
	<form method="post">
	<h3>Password</h3><br>
	<input name='pass' type="password" id='loginPassword'><br><br>
	<button>Login</button><br>
	<p id="loginError"><?echo $_GET['loginError']?></p>
	</form>
	</div>
	<p id='noPass'>Do you need the password? <a href="mailto:webservant@southhillcalvary.org?subject=Password%20for%20directory">Contact the Webservant</a></p>
	<?
	endPage();
	return 0;
}
?>
<div class='floatright'>
	<p id='numResults'>Showing 0 results</p>
	<span class='noPlaceholder'>&nbsp;Search:&nbsp;</span>
	<input type="text" id='searchBar' placeholder='Search' onkeyup="searchTable($(this).val())" />
</div>
<div id="results">Loading...</div>
<?
endPage();
?>
